<template>
	<view class="page">
		<view v-if="pageData">
			<view class="top-box flex-box align-center">
				<image src="../../static/index-banner.png" mode="aspectFill" class="banner"></image>
				<view class="flex-box align-center" v-if="pageData.shop">
					<navigator url="/pages/store/manage" hover-class="none" class="logo">
						<image :src="pageData.shop.logo ? $imgUrls(pageData.shop.logo) : '/static/head.png'" mode="">
						</image>
						<text class="iconfont icon-bianji"></text>
					</navigator>
					<view class="flex">
						<view>
							<text class="title m-right20">{{ pageData.shop.name }}</text>
							<text class="iconfont icon-switch"
								@click="toUrl('/pages/store/storeSelect?testStart=1')"></text>
						</view>
						<view class="address">{{ pageData.shop.address }}</view>
					</view>
					<image class="icon m-left20" src="/static/scan.png" @click="scan"></image>
				</view>
			</view>

			<view class="content" v-if="pageData.menu">
				<view class="list-boxs" :style="{ 'grid-template-columns': getGridColumns }">

					<view class="item" v-for="(item,index) in pageData.menu" :key="index" @click="menuTourl(item)">
						<image :src="item.img" class="menu"></image>
						<view>{{item.title}}</view>
					</view>

				</view>


				<view class="list-box">
					<view class="title flex-between" @click="toUrl('/pages/count/index')">
						<view class="">数据统计</view>
						<text class="iconfont icon-more"></text>
					</view>
					<view class="flex-box align-center">
						<view class="item" @click="toUrl('/pages/count/index')">
							<view class="count">{{ pageData.today_payment ? pageData.today_payment : '0' }}</view>
							<view class="txt">今日交易额</view>
							<view class="txt2">昨日{{ pageData.yesterday_payment ? pageData.yesterday_payment : '0' }}
							</view>
						</view>
						<view class="item" @click="toUrl('/pages/count/index')">
							<view class="count">{{ pageData.today_order ? pageData.today_order : '0' }}</view>
							<view class="txt">今日成单数</view>
							<view class="txt2">昨日{{ pageData.yesterday_order ? pageData.yesterday_order : '0' }}</view>
						</view>
						<view class="item" @click="toUrl('/pages/count/index')">
							<view class="count">{{ pageData.today_visits ? pageData.today_visits : '0' }}</view>
							<view class="txt">今日访问数</view>
							<view class="txt2">昨日{{ pageData.yesterday_visits ? pageData.yesterday_visits : '0' }}
							</view>
						</view>
					</view>
				</view>

				<view class="list-box">
					<view class="title flex-between" @click="toUrl('/pages/order/list')">
						<view>订单管理</view>
						<text class="iconfont icon-more"></text>
					</view>
					<view class="flex-box align-center">
						<view class="item" @click="toUrl('/pages/order/list?state=1')">
							<image src="/static/icon04.png" class="menu"
								:data-num="pageData.handle > 100?'100+':pageData.handle"
								:class="isunread ? 'unread' : 'unreadPlus'">
							</image>
							<view>待处理</view>
						</view>
						<view class="item" @click="toUrl('/pages/order/list?state=0')">
							<image src="/static/icon05.png" class="menu" :data-num="pageData.unpay"
								:class="{ unread: parseInt(pageData.unpay) > 0 }"></image>
							<view>未支付</view>
						</view>
						<view class="item" @click="toUrl('/pages/order/list?state=96')">
							<image src="/static/icon06.png" class="menu"></image>
							<view>已退款</view>
						</view>
					</view>
				</view>
				<view class="list-box">
					<view class="title flex-between" @click="toUrl('/pages/appointment/list')">
						<view class="">预约管理</view>
						<text class="iconfont icon-more"></text>
					</view>
					<view class="flex-box align-center">
						<view class="item" @click="toUrl('/pages/appointment/list?state=0')">
							<image src="/static/icon07.png" class="menu" :data-num="pageData.undo"
								:class="{ unread: parseInt(pageData.undo) > 0 }"></image>
							<view>待处理</view>
						</view>
						<view class="item" @click="toUrl('/pages/appointment/list?state=2')">
							<image src="/static/icon08.png" class="menu"></image>
							<view>已拒绝</view>
						</view>
						<view class="item" @click="toUrl('/pages/appointment/list?state=1')">
							<image src="/static/icon09.png" class="menu"></image>
							<view>已完成</view>
						</view>
					</view>
				</view>

				<view class="list-box" v-if="pageData.warehouseOpen == 1">
					<view class="title flex-between" @click="toUrl('/pages/warehouse/list')">
						<view class="">仓库订单</view>
						<text class="iconfont icon-more"></text>
					</view>
					<view class="flex-box align-center">
						<view class="item" @click="toUrl('/pages/warehouse/list?state=1')">
							<image src="/static/icon07.png" class="menu" :data-num="pageData.warehouseOrderCount"
								:class="{ unread: parseInt(pageData.warehouseOrderCount) > 0 }"></image>
							<view>待发货</view>
						</view>
						<view class="item" @click="toUrl('/pages/warehouse/list?state=2')">
							<image src="/static/icon08.png" class="menu"></image>
							<view>已发货</view>
						</view>
						<view class="item" @click="toUrl('/pages/warehouse/list?state=3')">
							<image src="/static/icon09.png" class="menu"></image>
							<view>已签收</view>
						</view>
					</view>
				</view>
			</view>
		</view>
		<empty type="1" v-if="noData" :msg="errmsg"></empty>

		<view class="Right" v-if="pageData.otherEntrance && pageData.otherEntrance.length">
			<block v-for="(item, index) in pageData.otherEntrance" :key="index">
				<view class="d-flex f-column a-center m-bot40" @click="toPage(item)">
					<image :src="item.img" mode="aspectFill" class="RighImg bor_radius"></image>
					<text class="size26 color_33 m-top10" v-if="item.title">{{ item.title }}</text>
				</view>
			</block>
		</view>

		<contact></contact>
	</view>
</template>

<script>
	import wx from 'jweixin-module'
	import {
		mapState,
		mapMutations
	} from 'vuex'
	var that, timer
	export default {
		data() {
			return {
				pageData: '',
				vid: '',
				noData: false,
				errmsg: '',
			}
		},

		onLoad(opt) {
			if (opt.store_id) {
				uni.setStorageSync('store_id', opt.store_id);
			}
			this.$http
				.get({
					url: '/singleSaleManageApi/getJsConfig?url=https://sra.mogoie.com/singleSaleShopH5/adminH5/',
				})
				.then((res) => {
					if (res) {
						wx.config(res)
					}
				})
			// #ifdef H5
			this.$common.H5HideShare()
			// #endif
		},
		onShow() {
			that = this
			uni.removeStorageSync('scanState')
			that.getStoreIndex()
			that.$common.H5HideShare()

		},

		methods: {
			...mapMutations(['updateDate']),
			menuTourl(Item) {
				if (Item.toUrl == '/pages/message/messageList' && this.pageData.service_state != 1) {
					uni.makePhoneCall({
						phoneNumber: this.pageData.service_tel,
					})
				} else {
					this.toUrl(Item.toUrl)
				}
			},

			toPage(item) {
				if (!item.url) return
				window.open(item.url)
			},
			scan() {
				wx.scanQRCode({
					needResult: 1, // 默认为0，扫描结果由微信处理，1则直接返回扫描结果，
					scanType: ['qrCode', 'barCode'], // 可以指定扫二维码还是一维码，默认二者都有
					success: function(res) {
						var result = res.resultStr
						if (result.indexOf('http') != -1) {
							window.open(result)
							return
						}
						uni.showToast({
							title: res,
							duration: 2000,
						})
						that.$http
							.get({
								url: '/singleSaleManageApi/scan',
								data: {
									code: result,
									shop_id: uni.getStorageSync('store_id'),
								},
							})
							.then((res) => {
								if (res.code == 200 && res.data) {
									console.log(res.data, 'res.data')
									if (res.data.type == 'sncode') {
										that.toUrl('/pages/appointment/detail?id=' + res.data.id)
									}
									if (res.data.type == 'order') {
										uni.setStorageSync('scanState', '1')
										// 2024/09/26 url add scanState
										that.toUrl(`/pages/order/detail?id=${res.data.id}&scanState=1`)
									}
									if (res.data.type == 'jumpUrl') {
										window.open(res.data.path)
									}
									if (res.data.type == 'lock') {
										that.toUrl('/pages/lock/lock?id=' + res.data.id)
									}
									if (res.data.type == 'getCharge') {
										const v_id = uni.getStorageSync('vid')
										if (v_id) uni.removeStorageSync('vid')
										that.toUrl('/Money/userMoney?id=' + res.data.id)
									}
									if (res.data.type == 'getTimeItemDetail') { // 核销次卡
										that.toUrl('/subCard/cancelCard/cancelCard?id=' + res.data.id)
									}
									if (res.data.type == 'getEventDetail') { // 核销合唱团
										that.toUrl('/pages/chorus/index?sign_id=' + res.data.id)
									}
								} else {
									uni.showToast({
										title: res.msg,
										icon: 'none',
									})
								}
							})
					},
				})
			},
			getStoreIndex() {
				that.noData = false
				that.$http
					.get({
						url: '/singleSaleManageApi/storeIndex',
						data: {
							shop_id: uni.getStorageSync('store_id'),
						},
					})
					.then((res) => {
						if (res.code != 200) {
							this.noData = true
							this.errmsg = res.msg
							this.back();
							return
						}
						const result = res.data;
						this.pageData = result;
						if (result.shop) this.$BarTitle(result.shop.name)
						if (result.bid) {
							uni.setStorageSync('bid', result.bid)
							uni.setStorageSync('uid', result.uid)
							this.updateDate({
								bid: result.bid,
								shareData: result.shop,
								uid: result.uid
							})
						}
						// 关闭预约取号
						if (result.appointmentQueueOpen != 1) {
							const Index = result.menu.findIndex(n => n.toUrl == '/queueup/takeNum')
							if (Index >= 0) this.pageData.menu.splice(Index, 1)
						}

					})
			},
			call() {
				if (that.pageData.tel) {
					uni.makePhoneCall({
						phoneNumber: that.pageData.tel,
					})
				}
			},
		},
		computed: {
			...mapState(['shopId']),
			isunread() {
				if (!this.pageData) return
				if (parseInt(this.pageData.handle) > 0 && parseInt(this.pageData.handle) < 100) {
					return true
				} else {
					return false
				}
			},
			getGridColumns() {
				if (!this.pageData || !this.pageData.menu) return;
				const num = this.pageData.menu.length
				return num < 5 ? `repeat(${num}, 1fr)` : 'repeat(5, 1fr)';
			}
		},
	}
</script>

<style lang="scss" scoped>
	.page {
		background-color: #ffffff;

		.top-box {
			height: 346rpx;
			position: relative;

			.banner {
				width: 100%;
				height: 100%;
				position: absolute;
				top: 0;
				left: 0;
			}

			.icon {
				width: 60rpx;
				height: 60rpx;
			}

			>view {
				position: relative;
				padding: 0 $page-space 0 40rpx;
				z-index: 3;
				width: 100%;

				.logo {
					width: 92rpx;
					height: 92rpx;
					margin-right: 30rpx;
					position: relative;

					image {
						border-radius: 50%;
						width: 100%;
						height: 100%;
					}

					.icon-bianji {
						position: absolute;
						background-color: #ffffff;
						width: 20rpx;
						height: 20rpx;
						line-height: 20rpx;
						text-align: center;
						border-radius: 4rpx;
						font-size: 12rpx;
						color: #979797;
						bottom: 0;
						right: 0;
					}
				}

				.title {
					color: $fff;
					font-size: $font-size-lg;
				}

				.address {
					color: $fff;
					margin-top: 12rpx;
				}

				.icon-switch {
					font-size: $font-size-base;
					color: $fff;
				}
			}
		}

		.content {
			padding: 0 $page-space;
			margin-top: -87rpx;
			position: relative;
			z-index: 3;

			.list-boxs {
				background-color: #ffffff;
				margin-bottom: $page-space;
				border-radius: $border-radius-lg;
				display: grid;
				padding: 20rpx;
				box-shadow: 0px 0px 4rpx 0px rgba(0, 0, 0, 0.06);
				border: 2rpx solid rgba(151, 151, 151, 0.05);
			}

			.list-box {
				background-color: #ffffff;
				margin-bottom: $page-space;
				border-radius: $border-radius-lg;
				justify-content: space-around;

				min-height: 174rpx;
				padding: 20rpx;
				box-shadow: 0px 0px 4rpx 0px rgba(0, 0, 0, 0.06);
				border: 2rpx solid rgba(151, 151, 151, 0.05);

				.title {
					padding-bottom: 10rpx;

					view {
						color: $color-text-aid;
					}
				}




			}

			.item {
				text-align: center;
				position: relative;
				padding: 30rpx 0;
				flex: 1;

				.menu {
					width: 50rpx;
					height: 50rpx;
					overflow: inherit;
				}

				.maxenu {
					width: 80rpx;
					height: 80rpx;
				}

				.count {
					font-weight: 600;
					text-shadow: 0px 0px 4px rgba(0, 0, 0, 0.06);
					font-size: 36rpx;
				}

				.txt {
					font-size: 26rpx;
					color: #666666;
					margin: 18rpx 0 12rpx;
				}

				.txt2 {
					font-size: 22rpx;
					color: #cccccc;
				}
			}


			.menu-box {
				background-color: #ffffff;
				margin-bottom: $page-space;
				flex-wrap: wrap;
				box-shadow: 0px 0px 4rpx 0px rgba(0, 0, 0, 0.06);
				border-radius: 20rpx;
				border: 2rpx solid rgba(151, 151, 151, 0.05);

				.item {
					text-align: center;
					width: 25%;
					padding: 36rpx 0;

					.menu {
						width: 56rpx;
						height: 56rpx;
					}
				}
			}
		}

		.Right {
			position: fixed;
			right: 20rpx;
			top: 30%;
			z-index: 100;

			.RighImg {
				width: 80rpx;
				height: 80rpx;
			}
		}
	}
</style>